<template>
  <div v-if="dataRows.length" class="list-tags">
    <a-tag v-for="(item, index) in dataRows" :key="index" :visible="true">
      {{ item[nameField] }}
    </a-tag>
  </div>
</template>
<script>
export default {
  props: {
    dataUrl: String,
    queryParams: {
      type: Object,
      default: () => {
        return {}
      }
    },
    nameField: {
      type: String,
      default: 'name'
    }
  },
  data() {
    return {
      dataRows: []
    }
  },
  mounted() {
    this.init()
  },
  watch: {
    dataUrl() {
      this.init()
    },
    queryParams() {
      this.init()
    }
  },
  methods: {
    init() {
      this.queryDataRows()
    },
    queryDataRows() {
      this.$http.post(this.dataUrl, this.queryParams).then((rs) => {
        const result = rs.data
        if (result.success) {
          this.dataRows = result.data
        } else {
          this.dataRows = []
        }
      })
    },
  }
}
</script>
